<template>
	<view class="flex_y body-item py32" @click="showGoods = true">
		<view class="body-item__left pr mr30">
			<image class="img156_156"
				src="https://magic-box-app.oss-cn-hangzhou.aliyuncs.com/images/75df1aad-f58e-4fa2-a192-c8651a604234_c8b09280400e47c89c25e00c2f910e12_dbdda5d8a4324f08900ddea2e42378f6_c90f0d140b7f40758cca4860d6b34b10.jpg"
				mode="aspectFill" />
			<view class="lfet__tag fjc fs20">预告</view>
		</view>
		<view class="body-item__info">
			<view class="goods__title fs28">
				<view class="ellipsis-1">商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称</view>
				<view class="FristTest YouSheBiaoTiHei">First赏</view>
			</view>
			<view class="goods_price">
				<view class="fs20">
					￥<text class="fs32 fw500">30.36</text>
				</view>
				<view class="" v-if="index === 0">
					×10
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {}
		},
	}
</script>

<style lang="scss">
	.img32_32 {
		width: 32rpx;
		height: 32rpx;
	}

	.img36_36 {
		width: 36rpx;
		height: 36rpx;
	}

	.img156_156 {
		width: 156rpx;
		height: 156rpx;
		border-radius: 8rpx;
	}

	.FristTest {
		width: 102rpx;
		font-size: 28rpx;
		line-height: 32rpx;
		background: linear-gradient(107deg, #F074AB 0%, #7D71F5 99%);
		-webkit-background-clip: text;
		-webkit-text-fill-color: transparent;
		background-clip: text;
		text-fill-color: transparent;
	}

	.body-item {
		border-bottom: 1rpx solid rgba(0, 0, 0, 0.1);

		&__left {
			.lfet__tag {
				position: absolute;
				top: -8rpx;
				left: 0;
				width: 60rpx;
				height: 32rpx;
				color: #fff;
				background: #FF7803;
				border-radius: 8rpx 0 8rpx 0;
			}
		}

		.goods__title {
			display: flex;
			flex-direction: column;
			justify-content: space-between;
			width: 480rpx;
			height: 92rpx;
		}

		.goods_price {
			width: 480rpx;
			height: 64rpx;
			display: flex;
			align-items: flex-end;
			justify-content: space-between;
		}
	}
</style>